<template>
	<view class="uni-new-exclusive">
		<view class="uni-new-exclusive-main">
			<view class="uni-new-exclusive-top">
				<image class="uni-new-exclusive-top-img" src="../../static/red_packet.png" mode="widthFix"></image>
			</view>
			<scroll-view class="uni-new-exclusive-box" scroll-y="true">
				<view style="title-tips">
					<text>*优惠券已发放到账号，请到我的优惠券查看</text>
				</view>
				<view class="uni-new-exclusive-item" v-for="(item,index) in red_packets" :key="index">
					<view class="uni-new-exclusive-item-col uni-new-exclusive-item-price" v-if="item.coupon_type != 2">
						￥{{ item.money }}
					</view>
					<view class="uni-new-exclusive-item-col uni-new-exclusive-item-price" v-if="item.coupon_type == 2">
						{{item.discount}}折
					</view>
					<view class="uni-new-exclusive-item-col uni-new-exclusive-item-info" v-if="item.coupon_type == 1">
						<view class="title">
							满{{item.limit_money}}元减{{item.money}}元
						</view>
						<text class="limit">
							满减劵
						</text>
					</view>
					<view class="uni-new-exclusive-item-col uni-new-exclusive-item-info" v-if="item.coupon_type == 2">
						<view class="title">
							满{{item.limit_money}}元打{{item.discount}}折
						</view>
						<text class="limit">
							满折劵
						</text>
					</view>
					<view class="uni-new-exclusive-item-col uni-new-exclusive-item-info" v-if="item.coupon_type == 3">
						<view class="title">
							无门槛使用！！！
						</view>
						<text class="limit">
							无门槛优惠券
						</text>
					</view>
					<view class="uni-new-exclusive-item-col uni-new-exclusive-item-link" @click="toGoodList(item)">
						<text>去使用</text> 
					</view>
					 
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'uni-new-exclusive',
		props: {},
		data() {
			return {
				red_packets: [],
			};
		},
		created() {
			this.get_red_packets();
		},
		onShow() {
			
		},
		methods: {
			toGoodList(item) {
				if(item.page !== '') {
					this.$util.redirectTo('/otherpages/diy/diy/diy', {
						name: item.page
					})
				}
			},
			get_red_packets() {
				this.$api.sendRequest({
					url: '/newusercoupon/api/coupon/page',
					data: {
						page: 1,
						page_size: 10,
						status: 0,
					},
					success: res => {
						if (res.code == 0) {
							this.red_packets = res.data.list;
							console.log(this.red_packets,'1111')
						}
					},
				});	
			},
		}
	}
</script>

<style lang="scss" scoped>
.uni-new-exclusive-main {
	box-sizing: border-box;
	width: 80vw;
	background-color:#EF3030;
	position: relative;
	overflow: hidden;
	border-radius: 0 0 30rpx 30rpx;
	
	.uni-new-exclusive-top {
		width: 100%;
		position: fixed;
		top:12rpx;
		left:0;
		
		.uni-new-exclusive-top-img {
			position: fixed;
			left:-6rpx;
			width: 102%;
		}
	}
	
	
	.uni-new-exclusive-box {
		height: 31vh;
		overflow:hidden;
		background-color: #EF3030;
		box-sizing: border-box;
		padding: 10rpx 20rpx;
		
		.uni-new-exclusive-tips {
			color: #fff;
			
			text {
				margin-left: 5vw;
			}
		}
		
		text{
			color:#fff;
			font-size:20rpx;
			margin-left:10rpx;
		}
		
		.uni-new-exclusive-item {
			display: flex;
			justify-content:center;
			align-items: center;
			flex-wrap: nowrap;
			margin: 10rpx auto;
			width: 70vw;
			height: 150rpx;
			background-color: #fff;
			border-radius: 20rpx;
			
			.uni-new-exclusive-item-col{
				text-align: center;
			}
			
			.uni-new-exclusive-item-price {
				color:#EF3030;
				font-size: 40rpx;
				width: 30%;
			}
			
			.uni-new-exclusive-item-info {
				width: 35%;
				display: flex;
				flex-direction: column;
				box-sizing: border-box;
				text-align: left;
				
				.title {
					font-weight: 600;
					font-size: 30rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
				.limit {
					font-size: 24rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					color: #ADAEAE;
					margin-left: 0;
				}
			}
			.uni-new-exclusive-item-link {
				text-align: center;
				width: 30%;
				
				text {
					width: 110rpx;
					display: inline-block;
					box-sizing: border-box;
					padding: 8rpx 0;
					background-color: #FE4542;
					border-radius: 40rpx;
					color: #fff;
				}
			}
			
		}
	}
	.uni-new-exclusive-close {
		position: fixed;
		top: 70vh;
		left: 50%;
		transform: translateX(-25rpx) rotate(45deg);
		width: 50rpx;
		height: 50rpx;
		text-align: center;
		line-height: 50rpx;
		color: #fff;
		font-size: 50rpx;
	}
}


</style>
